<template>
  <!-- 档案机构变更 -->
  <changeBase>
    <template v-slot:main-button>
      <mainButton
        @toMainSearch="search"
        @toMainSearchReset="reset"
        :main-button="mainButton"
      />
    </template>
    <template v-slot:search-info>
      <searchMain
        size="mini"
        :label-width="labelWidth"
        ref="searchMain"
        :model="formData"
        :rules="searchRules"
        :itemList="formItemList"
      />
      <el-divider />
    </template>
    <template v-slot:table-main>
      <common-table
        :data="infoList"
        ref="infoList"
        border
        :columns-item="columns"
        :title="infoTitle"
        :loading="false"
        :displayColumn="displayColumn"
        @removeRowData="removeRowData"
        @checkbox-change="selectChangeEvent"
      />
    </template>
    <!-- <template v-slot:add-dialog>
      <organAddDialog
        :flagVisible.sync="dialog_show"
        :dialogType.sync="dialogType"
        ref="organAddDialog"
        :formData="changeData"
        :formItme="columnLabel"
        @submitData="submitData"
        @clearCheckboxRowSelect="clearCheckboxRowSelect"
      />
    </template> -->
  </changeBase>
</template>

<script>
import changeBase from "@/components/Layout/changeBase.vue"
import mainButton from "@/components/CommonButtons/MainButton.vue"
import searchMain from "@/components/CommonForm/index.vue"
import CommonTable from "@/components/CommonTable/index.vue"
import fileForm from "@/components/FileForm/FileForm.vue"
import organAddDialog from "@/views/dialog/record/organAddDialog.vue"
// 加载模拟数据
import {
  infoList,
  sexs,
  fileStatusType,
  changeType,
  changeState,
  addressList,
  information,
  isSignType,
  familyInformation,
  complete,
  peopleSigns,
  publicSigns,
  dataProps,
  searchHandle
} from "@/simdata/healthData.js"
export default {
  name: "file-change",
  components: {
    changeBase,
    mainButton,
    searchMain,
    CommonTable,
    fileForm,
    organAddDialog
  },
  data() {
    return {
      // 配置常用按钮
      mainButton: [
        {
          label: "查看个人档案",
          icon: "el-icon-search",
          type: "primary",
          handle: () => {
            this.addHandle()
          }
        },
        {
          label: "全程健康档案服务",
          icon: "el-icon-receiving",
          type: "success",
          handle: () => {
            console.log("点击了")
          }
        }
      ],
      // 查询表单
      formData: {
        keyword: "", // 个人信息项 字段
        keyValue: "" // 值
      },
      // label的宽度
      labelWidth: "auto",
      // 验证
      searchRules: {},
      // 配置search label表单
      formItemList: [
        {
          type: "myInformation",
          label: "个人信息查询项目",
          span: 16,
          options: [
            { label: "个人档案号", value: 1 },
            { label: "姓名", value: 3 },
            { label: "身份证号", value: 4 }
          ],
          props: dataProps
        }
      ],
      // 所有列表数据
      infoTitle: "人员基本信息列表",
      infoList: infoList,
      // 当前复选框选中
      currentlySelected: [],
      // 配置显示的label标签
      columns: [
        { prop: "name", label: "姓名", width: "100" },
        {
          prop: "sex",
          label: "性别",
          width: "68",
          type: "sex",
          option: sexs
        },
        { prop: "age", label: "年龄", width: "80" },
        { prop: "birthdata", label: "出生日期", width: "100" },
        { prop: "identityNumber", label: "身份证号", width: "180" },
        { prop: "phonenumber", label: "本人电话号码", width: "150" },
        { prop: "linkName", label: "联系人姓名", width: "100" },
        { prop: "linkNumber", label: "联系人电话", width: "150" },
        { prop: "nowAddress", label: "现住地址", width: "150" },
        {
          prop: "isSign",
          label: "是否签约",
          width: "80",
          type: "isSign",
          option: isSignType
          // callback: row => {
          //   let text = ""
          //   switch (row.isSign) {
          //     case 1:
          //       text = "已签约"
          //       break
          //     case 2:
          //       text = "未签约"
          //       break
          //     default:
          //       text = "其他"
          //   }
          //   return text
          // }
        }, //
        { prop: "responsibleDoctor", label: "责任医生", width: "100" },
        {
          prop: "isHome",
          label: "家庭信息",
          width: "80",
          type: "isHome",
          option: familyInformation
          // callback: row => {
          //   let text = ""
          //   switch (row.isHome) {
          //     case 1:
          //       text = "有"
          //       break
          //     case 2:
          //       text = "无"
          //       break
          //     default:
          //       text = "其他"
          //   }
          //   return text
          // }
        }, //
        { prop: "creatDoctor", label: "建档医生", width: "100" },
        { prop: "createDate", label: "建档日期", width: "100" },
        { prop: "myNumber", label: "个人健康档案号", width: "150" },
        { prop: "number", label: "家庭档案号", width: "150" },
        {
          prop: "isComplete",
          label: "信息是否完整",
          width: "120",
          type: "isComplete",
          option: complete
          // callback: row => {
          //   let text = ""
          //   switch (row.isComplete) {
          //     case 1:
          //       text = "完整"
          //       break
          //     case 2:
          //       text = "不完整"
          //       break
          //     default:
          //       text = "其他"
          //   }
          //   return text
          // }
        },
        {
          prop: "isLibrary",
          label: "人口库标记",
          width: "100",
          type: "isLibrary",
          option: peopleSigns
          // callback: row => {
          //   let text = ""
          //   switch (row.isLibrary) {
          //     case 1:
          //       text = "是"
          //       break
          //     case 2:
          //       text = "否"
          //       break
          //     default:
          //       text = "其他"
          //   }
          //   return text
          // }
        },
        {
          prop: "isPublic",
          label: "公安标记",
          width: "80",
          type: "isPublic",
          option: publicSigns
          // callback: row => {
          //   let text = ""
          //   switch (row.isPublic) {
          //     case 1:
          //       text = "是"
          //       break
          //     case 2:
          //       text = "否"
          //       break
          //     default:
          //       text = "其他"
          //   }
          //   return text
          // }
        }
      ],
      // 控制表格前面的勾选按钮
      // showHeader: {
      //   checkStrictly: true
      // },
      // 控制表格操作按钮的显示隐藏
      displayColumn: {
        operationCol: true,
        editBtn: false,
        removeBtn: true
      },

      // 机构变更回显
      changeData: {},
      // 配置显示的label标签
      columnLabel: []
      // 弹框标记
      // dialog_show: false,
      // 标题控制
      // dialogType: "new"
    }
  },
  mounted() {},
  computed: {},
  methods: {
    // 点击新增按钮
    addHandle() {
      // console.log("点击新增了")
    },
    // 点击搜索按钮
    search(formName) {
      this.$refs.searchMain.$refs[formName].validate(valid => {
        if (valid) {
          // 调用接口
          // this.callbackComponent()
        } else {
          console.log("error submit!!")
          return false
        }
      })
    },
    // 点击重置按钮
    reset(formName) {
      this.$refs.searchMain.$refs[formName].resetFields()
      this.formData.keyword = ""
      this.formData.keyValue = ""
    },
    // 点击搜索后，请求后台接口了
    callbackComponent() {
      console.log("调接口")
    },
    // 基本信息复选框选中
    selectChangeEvent(data) {},
    // 确认提交数据
    submitData(data) {},
    // 删除对应的数据
    removeRowData(data) {
      // this.$confirm("此操作将永久删除, 是否继续?", "提示", {
      //   confirmButtonText: "确定",
      //   cancelButtonText: "取消",
      //   type: "warning"
      // })
      //   .then(() => {
      //     this.infoList.splice(data.rowIndex, 1)
      //     this.$message({
      //       type: "success",
      //       message: "删除成功!"
      //     })
      //   })
      //   .catch(() => {
      //     this.$message({
      //       type: "info",
      //       message: "已取消删除!"
      //     })
      //   })
    },
    // 关闭弹框，清空table选中数据
    clearCheckboxRowSelect(data) {
      // this.$refs.infoList.$refs["infoTable"].clearCheckboxRow()
    }
  }
}
</script>

<style lang="scss" scoped></style>
